import 'package:flutter/material.dart';
import 'model/card_item.dart';
import 'preview_page.dart'; // 引入新页面
import 'model/card_items_config.dart';

// 定义应用的入口函数
void main() => runApp(const MyApp());

// 抽离主题配置
ThemeData buildAppTheme() {
  return ThemeData(
    colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepOrangeAccent),
  );
}

// 抽离路由配置
Map<String, WidgetBuilder> buildAppRoutes() {
  return {
    '/': (context) => const MyHomePage(title: 'Home Page'),
    '/preview':
        (context) => PreviewPage(
          cardItem: ModalRoute.of(context)!.settings.arguments as CardItem,
        ), // 修改为接收 CardItem 参数
  };
}

// 定义应用的根组件
class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    // 定义应用的标题
    const String appTitle = 'Flutter Layout Demo';
    return MaterialApp(
      title: appTitle,
      theme: buildAppTheme(),
      initialRoute: '/', // 设置初始路由
      routes: buildAppRoutes(),
    );
  }
}

// 定义主页组件
class MyHomePage extends StatefulWidget {
  const MyHomePage({super.key, required this.title});

  final String title;

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

// 定义主页的状态类
class _MyHomePageState extends State<MyHomePage> {
  // 默认选中的分类
  String _selectedCategory = '首页';
  // 根据分类获取的卡片列表
  List<CardItem> _cardItems = getCardItemsByCategory('首页');

  // 处理分类选择事件
  void _onCategorySelected(String category) {
    setState(() {
      _selectedCategory = category;
      _cardItems = getCardItemsByCategory(category);
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Theme.of(context).colorScheme.inversePrimary,
        title: Text(widget.title),
      ),
      drawer: Drawer(
        child: ListView(
          padding: EdgeInsets.zero,
          children: <Widget>[
            const DrawerHeader(
              decoration: BoxDecoration(color: Colors.blue),
              child: Text(
                '一级布局分类',
                style: TextStyle(color: Colors.white, fontSize: 24),
              ),
            ),
            ListTile(
              leading: const Icon(Icons.home),
              title: const Text('首页'),
              onTap: () {
                _onCategorySelected('首页');
                Navigator.pop(context);
              },
            ),
            ListTile(
              leading: const Icon(Icons.settings),
              title: const Text('设置'),
              onTap: () {
                _onCategorySelected('设置');
                Navigator.pop(context);
              },
            ),
            ListTile(
              leading: const Icon(Icons.work_outline_outlined),
              title: const Text('项目实战'),
              onTap: () {
                _onCategorySelected('项目实战');
                Navigator.pop(context);
              },
            ),
          ],
        ),
      ),
      body: SingleChildScrollView(
        child: Column(
          children: [
            GridView.builder(
              shrinkWrap: true,
              physics: const NeverScrollableScrollPhysics(),
              gridDelegate: const SliverGridDelegateWithMaxCrossAxisExtent(
                maxCrossAxisExtent: 200.0, // 设置最大宽度限制
                crossAxisSpacing: 16.0,
                mainAxisSpacing: 16.0,
              ),
              itemCount: _cardItems.length,
              itemBuilder: (context, index) {
                return GestureDetector(
                  onTap: () {
                    Navigator.pushNamed(
                      context,
                      '/preview',
                      arguments: _cardItems[index], // 传递 CardItem 对象
                    );
                  },
                  child: Card(
                    child: Center(
                      child: Column(
                        children: [
                          Padding(
                            padding: const EdgeInsets.all(10.0),
                            child: Text(
                              _cardItems[index].title,
                              style: const TextStyle(fontSize: 18),
                              textAlign: TextAlign.center,
                            ),
                          ),
                          Padding(
                            padding: const EdgeInsets.all(16.0),
                            child: Text(
                              _cardItems[index].content,
                              style: const TextStyle(fontSize: 16),
                              textAlign: TextAlign.center,
                            ),
                          ),
                        ],
                      ),
                    ),
                  ),
                );
              },
            ),
          ],
        ),
      ),
    );
  }
}
